<!DOCTYPE html>
<html lang="zh_CN">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>登录</title>
  <link rel="stylesheet" href="./css/login.css">
</head>
<body>
    <div class="form">
      <div class="row">
        <div class="row-hd">用户名:</div>
        <div class="row-bd"><input type="text" id="username" value="bsc"></div>
      </div>
      <div class="row">
        <div class="row-hd">密码:</div>
        <div class="row-bd"><input type="text" id="password" value="123"></div>
      </div>
      <div class="btn">登录</div>
    </div>
    <script>
      const usernameEl = document.querySelector("#username")
      const passwordEl = document.querySelector("#password")
      const btnEl = document.querySelector(".btn")
      btnEl.onclick = function(){
        let username = usernameEl.value;
        let password = passwordEl.value;
        let xhr = new XMLHttpRequest();
        xhr.open("post","/login",true)
        xhr.setRequestHeader("content-type","application/json")
        xhr.onload = function(){
          let res = JSON.parse(xhr.responseText)
          if(res.state){
            localStorage.setItem("requestToken",res.data.token)
            location.href="./index.html"
          }
        }

        xhr.send(JSON.stringify({username:username,password:password,}))
      }
    </script>
</body>
</html>